@import "~taro-ui/dist/style/components/button.scss";
.container{
    height: 100%;
    width: 100%;
   .order .hydrated{
        width: auto;
    }
    .ordercontent{
        background-color: white;
    .ordermid1{
        padding-top: 10px;
        display: flex;
        justify-content: space-between;
        font-size: 30px;
        .orderimg{
            padding-left: 20px;
            padding-right: 20px;
        }
        .countdown{
            margin-top:40px ;
        }
        .oderimgtext{
                display: flex;
                justify-content: space-around;
                margin-top: 40px;
                align-items: center;
                flex-wrap: nowrap;
                .oderimgtext1{
                    padding-left: 20px;
                }
            }
        .ordername{
            display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp:2;    
      text-overflow: ellipsis;
      overflow: hidden;
      white-space: nowrap;
    }
    }
  
        .ping{
            border: 1px solid #E80001;
            height: 100px;
            width: 100px;
            border-radius: 50%;
            line-height: 100px;
            text-align: center;
            background-color:#E80001;
            color: white;
        }
    }
    .at-countdown--card .at-countdown__time-box{
        color: black;
    }
    .middle .hydrated{
        width: auto;
    }
    .middle{
        background-color: white;
        margin-top: 20px;
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        justify-content: center;
        height: 300px;
        .midtou{
            display: flex;
            justify-content: center; 
            .midtou1{
                padding-right: 10px;
            } 
        }
    }
    .midtop .hydrated{
        width: 100;
    }
    .midtop{
        margin-top: 20px;
        background-color: white;
        text-align: center;
    }
    .middledetail{
        margin-top: 1.21333rem;
        height: 100%;
        display: flex;
            justify-content: space-around;
            flex-wrap: wrap;
        .middet{
            background-color: white;
            margin-top: 40px;
            display: flex;
            justify-content: space-around;
            flex-wrap: wrap;
            width: 47%;
            .middetimg{
                text-align: center;
                padding-top: 10px;
            }
            .iontDe{
                font-size: medium;
                display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp:2;    
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
            }
            .bottomtext{
                display: flex;
                justify-content: space-around;
            }
        }
    }
    .tab{
        position: fixed;
        top:95%;
        display: flex;
        justify-content: space-between;
        background-color: #F7F7F7;
        margin-left: 40px;
        width: 90%;
        .tableft{
            text-align: center;
            background-color:#c5c3c3;
            color: white;
            border-radius: 10px;
            margin-right: 20px;
        }
        .tabright{
            text-align: center;
            background-color:#fa4b4b ;
            color: white;
            border-radius: 10px;
        }
    }
}